<template>
  <div class="container">
    <div>
      <a-button type="primary" @click="addType">
        <template #icon><icon-plus-circle /></template>添加
      </a-button>
    </div>
    <a-table :bordered="{cell:true}" :pagination="false" stripe :data="state.typeList">
      <template #columns>
        <a-table-column title="意见分类名称" data-index="title"></a-table-column>
        <a-table-column title="操作" width="250">
          <template #cell="{ record }">
            <a-space>
              <a-button type="primary" size="small" @click="editType(record.id)"><template #icon><icon-edit /></template>修改</a-button>
              <a-popconfirm content="确认删除吗?" @ok="deleteType(record.id)">
                <a-button type="primary" status="danger" size="small"><template #icon><icon-delete /></template>删除</a-button>
              </a-popconfirm>
            </a-space>
          </template>
        </a-table-column>
      </template>
    </a-table>
    <a-modal :title="state.popupTitle" v-model:visible="state.entityDetailVisible" :footer="false">
      <TypeDetail v-if="state.entityDetailVisible" v-model="state.entityDetailVisible" :entityId="state.popupEntityId"></TypeDetail>
    </a-modal>
  </div>
</template>

<script lang="ts" setup>
import axios from "axios";
import { Message } from '@arco-design/web-vue'
import mittBus from "@/utils/route-listener"
import {reactive, ref, onMounted, onUnmounted, defineAsyncComponent} from "vue";
import { useRouter } from "vue-router";
const router = useRouter();
const TypeDetail = defineAsyncComponent(() => import('@/views/basedata/yijiantype/typeDetail.vue'));

const state = reactive({
  sd: {
    pageNum: 1,
    pageSize: 5
  },
  typeList: [],
  entityDetailVisible : false,
  popupTitle : '',
  popupEntityId : 0,
})
const loadType = ()=>{
  axios.post('/yijian/pageyijiantype', state.sd).then(res => {
    const { data } = res
    state.typeList = data
  })
}
const addType = ()=>{
  state.popupEntityId = 0;
  state.popupTitle= "新增意见分类"
  state.entityDetailVisible= true
}
const editType = (id)=>{
  state.popupEntityId= id;
  state.popupTitle= "修改意见分类"
  state.entityDetailVisible= true
}

const deleteType = (id)=>{
  axios.post('/yijian/deleteyijiantype',{id : id}).then(res => {
    const { code, msg } = res
    if(code === '200') {
      Message.success(msg)
      loadType();
    }else{
      Message.error(msg)
    }
  })
}
onMounted(()=>{
  loadType();
  mittBus.on("typeadd", ()=>{
    state.sd.pageNum = 1;
    loadType();
  })
  mittBus.on("typeedit", ()=>{
    loadType();
  })
})
onUnmounted(()=>{
  mittBus.off("typeadd", ()=>{})
  mittBus.off("typeedit",()=>{})
})
</script>

<style scoped>

</style>
